<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<div class="module-container link-block" (click)="gotoSnapshot()">
  <div class="aui-header-1 border_bottom">
    <lv-group lvGutter="8px" [lvColumns]="['auto', '65px']">
      <h2 class="home-module-title">
        {{ 'common_exceptions_file_system_label' | i18n }}
      </h2>
      <div class="total-count">
        {{ 'common_total_label' | i18n }}：{{ total }}
      </div>
    </lv-group>
  </div>
  <div class="exceptions-file-talbe-container" [ngStyle]="{'display':total>0 ? 'block':'flex'}">
    <ng-container *ngIf="total>0 else emptyTpl">
    <table class="exceptions-file-talbe">
      <thead>
        <tr>
          <th>{{ 'common_name_label' | i18n }}</th>
          <th>{{ 'protection_ownership_equipment_index_label' | i18n }}</th>
          <th>{{ 'explore_belong_tenant_label' | i18n }}</th>
          <th>{{ 'common_last_detection_time_label' | i18n }}</th>
        </tr>
      </thead>
      <tbody>
        <ng-container *ngFor="let item of tableData">
        <tr>
          <td>
            <span class="aui-link" (click)="gotoDetectionDetail(item)">
              {{ item.resourceName }}
            </span>
          </td>
          <td>
            {{ item.environmentName }}
          </td>
          <td>
            {{ item.vstoreName }}
          </td>
          <td>
            {{ item.latestDetectionTime }}
          </td>
        </tr>
      </ng-container>
      </tbody>
    </table>
    </ng-container>
  </div>
</div>
<ng-template #emptyTpl>
  <lv-group lvDirection="vertical" lvGutter="2px" class="no-exception-file-container">
    <div class="exceptions-file-no-config"></div>
    <span>{{'common_no_data_label'|i18n}}</span>
  </lv-group>
</ng-template>
